// lazy要和Suspense配合适用
import React, { Component, lazy, Suspense } from "react";
// import Child from "./Child";

const Child = lazy(() => import("./Child"));

class App extends Component {
  state = {
    show: false,
  };

  fn = () => {
    this.setState({
      show: !this.state.show,
    });
  };
  render() {
    return (
      <>
        <h3>组件懒加载</h3>
        <button onClick={this.fn}>btn</button>
        <Suspense fallback={<div>loading...</div>}>
          {this.state.show && <Child />}
        </Suspense>
      </>
    );
  }
}

export default App;
